import React from 'react'
import style from './inquire.module.scss'
import type {paperlist,subjectslist} from '../../../../services/type'
type Props = {
  papername:string
  person:string
  subjectstype:string
  createdby:paperlist[]
  subjects:subjectslist[]
  changePapername:(vel:string) => void
  changePerson:(vel:string) => void
  changeSubjectsType:(vel:string) => void
  getInquire:()=>void
  purge:()=>void
}

const Inquire = ({papername,person,subjectstype,createdby,subjects,changePapername,changePerson,changeSubjectsType,getInquire,purge}:Props) => {
 
  return (
    <div className={style.choose}>
        <span>
          <em>试卷名称</em>
          <input type="text" placeholder='请输入' value={papername} onChange={(e)=>{changePapername(e.target.value)}}/>
        </span>
        <span>
          <em>创建人</em>
          <select name="" id="" value={person} onChange={(e)=>changePerson(e.target.value)} >
            <option value="" disabled selected>请选择</option>
            {createdby.map(vel=>
              <option value={vel.username} key={vel._id}>{vel.username}</option>
            )}
          </select>
        </span>
        <span>
          <em>查询科目</em>
          <select name="" id="" value={subjectstype} onChange={(e)=>changeSubjectsType(e.target.value)} >
            <option value="" disabled selected>请选择</option>
            {subjects.map(vel=>
              <option value={vel.name} key={vel._id}>{vel.name}</option>
            )}
          </select>
        </span>
        <button onClick={()=>{getInquire()}}>查询</button>
        <button onClick={()=>{purge()}}>重置</button>
      </div>
  )
}

export default Inquire